<template>
    <div>
        <article class="main-breadcrumb">
            <el-breadcrumb separator=">" class="main-breadcrumb-wrap">
                <el-breadcrumb-item>
                    <span class="main-breadcrumb-home">养殖管理</span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>
                    <span @click="$router.back(-1)" class="main-breadcrumb-home">车辆调拨单</span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>
                    <span class="main-breadcrumb-home">车辆调拨单入库</span>
                </el-breadcrumb-item>
            </el-breadcrumb>
        </article>
        <div class="nx-content">
            <div class="flex-bet">
                <div class="left-title flex">
                    <div style="display: flex ;margin-right: 1rem;">
                        <ImportNew @onSubmit="onSubmit" :data="dataObj"
                            :url="'dataCarTransferOrderInDetail/importDataCarTransferOrderInDetailList'"></ImportNew>
                        <el-button
                            style="
                                                                                                                                                                              background-color: #0a5fb2;
                                                                                                                                                                              border-color: #0a5fb2;
                                                                                                                                                                              border-radius: 60px;
                                                                                                                                                                              width: 95px;
                                                                                                                                                                            "
                            @click="exportFile" icon="el-icon-download" type="success">导出</el-button>

                    </div>
                    <!-- <div v-allow="'020101'" class="add-btn" @click="handleAdd()">添加入库单</div> -->
                </div>

            </div>
            <NxTable :table-cols="tableCols" :table-data="tableData" :pag-ination="pagination" class="table-wrap"
                @refresh="refresh">
                <template slot="sex" slot-scope="scope">
                    <span v-if="scope.row.sex == 0">未鉴定</span>
                    <span v-if="scope.row.sex == 1">雄</span>
                    <span v-if="scope.row.sex == 2">雌</span>

                </template>
                <template slot="operation" slot-scope="scope">
                    <!-- <span v-allow="'020105'" @click="handleDetail(scope.row)" class="nx-btn nx-edit">详情</span> -->
                    <span @click="handleEdit(scope.row)" class="nx-btn nx-edit">详情</span>
                    <!-- <span v-allow="'020104'" @click="handleDelete(scope.row)" class="nx-btn nx-del">删除</span> -->
                </template>
            </NxTable>
        </div>
        <AddEditDialog :addEditId="addEditId" :addEditStatus="addEditStatus" :addEditIsDialog="addEditIsDialog">
        </AddEditDialog>
    </div>
</template>
<script>
import NxTable from "@/components/NxTable.vue";
import AddEditDialog from "./components/addEditDialog.vue";
import { Page } from "@/utils/pagination";
import ImportNew from '@/components/ImportNew.vue'
import {
    getDataCarTransferOrderInDetailList, exportDataCarTransferOrderInDetailList, delDataCarTransferOrderInDetail
} from "@/api/stock";
import { getCompanyInfoTree } from "@/api/company";
import { getSysCompanyBases } from "@/api/system";

export default {
    components: {
        NxTable,
        AddEditDialog,
        ImportNew
    },
    // 表格数据
    data() {
        return {
            dataObj: {},
            // 查询字段
            searchForm: {
                pageNum: 1,
                pageSize: 10,
                companyId: "",
                baseId: "",
                typeId: "",
                code: "",
                typeName: '车辆调拨入库',
                // fishpondCode: "",
                // fishpondName: "",
            },
            // 表格字段
            tableCols: [

                {
                    label: "公司名称",
                    prop: "companyName",
                    align: "center",
                    width: 250,
                },
                {
                    label: "基地名称",
                    prop: "baseName",
                    align: "center",
                    width: 250,
                },
                {
                    label: "批次编码",
                    prop: "batchCode",
                    align: "center",
                },
                {
                    label: "车辆调拨单号",
                    prop: "carTransferOrderCode",
                    align: "center",
                    width: 150,
                },
                {
                    label: "卵径",
                    prop: "diameter",
                    align: "center",
                    width: 150,
                },
                {
                    label: "鱼名",
                    prop: "fishName",
                    align: "center",
                    width: 150,
                },
                {
                    label: "转出鱼池名称",
                    prop: "fishpondName",
                    align: "center",
                    width: 170,
                },
                {
                    label: "鱼尾数",
                    prop: "num",
                    align: "center",
                },
                {
                    label: "性别",
                    slot: "sex",
                    align: "center",
                }, {
                    label: "鱼总重",
                    prop: "weight",
                    align: "center",
                },
                {
                    label: "平均重量",
                    prop: "weightAve",
                    align: "center",
                },
                {
                    label: "初期重量",
                    prop: "weightPrime",
                    align: "center",
                },

                {
                    label: "操作",
                    slot: "operation",
                    align: "center",
                    width: 160,
                    fixed: "right",
                },
            ],
            tableData: [],
            pagination: new Page(),
            crumbsStatus: "", // 三级面包屑名称
            typeDialog: false,
            addEditIsDialog: false, // 添加编辑页面状态
            addEditStatus: "add",
            addEditId: "", // 添加编辑rowid
            baseArray: [], // 基地集合
            companyArray: [], // 公司集合
            userType: "", // 用户类型（0超级管理员，1公司管理员，2公司员工）
        };
    },
    // 初始化加载
    mounted() {
        this.userType = Number(window.localStorage.getItem("userType"));
        this.searchForm.userType = this.userType
        this.getCompanyInfoTree();
        this.getList();
        this.dataObj.id = this.$route.query.id
    },
    // 自定义方法
    methods: {
        handleDetail(row) {
            this.$router.push({
                path: `/stock/purchaseDetail?id=` + row.id + `&typeName=` + row.typeName,
            });
        },
        // 查询
        onSubmit() {
            this.pagination.pageNum = 1;
            this.getList();
        },
        // 分页查询
        refresh(val) {
            this.searchForm.pageNum = val.pageNum;
            this.searchForm.pageSize = val.pageSize;
            this.getList();
        },
        // 重置
        resetForm() {
            this.searchForm = {
                pageNum: 1,
                pageSize: 10,
                companyId: "",
                baseId: "",
                fishpondName: "",
                code: "",
                status: "",
                typeName: '其他入库',

            };

            this.onSubmit();
        },
        // 查询列表
        getList() {
            console.log(this.searchForm);
            getDataCarTransferOrderInDetailList({ id: this.$route.query.id }).then((res) => {
                if (res.code == 200) {
                    this.tableData = res.data.data;
                    this.pagination.count = res.data.total;
                }
            });
        },
        // 删除
        handleDelete(row) {
            this.$confirm("此操作将永久删除, 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    delDataCarTransferOrderInDetail({ id: row.id }).then((res) => {
                        if (res.code == 200) {
                            this.$message({
                                type: "success",
                                message: res.msg,
                            });
                            this.getList();
                        }
                    });
                })
                .catch((err) => {
                    this.$message({
                        type: "info",
                        message: "已取消删除",
                    });
                });
        },
        // 添加
        handleAdd() {
            this.addEditId = "";
            this.addEditStatus = "add";
            this.addEditIsDialog = true;
        },
        // 编辑
        handleEdit(row) {
            this.addEditId = row.id + "";
            this.addEditStatus = "edit";
            this.addEditIsDialog = true;
        },
        // 编辑添加取消关闭
        closeAddEdit() {
            this.addEditIsDialog = false;
        },
        // 面包屑
        crumbsClick() {
            this.typeDialog = false;
        },
        // 导出模板
        exportFile() {
            const params = new URLSearchParams();
            params.append('id', this.$route.query.id)
            exportDataCarTransferOrderInDetailList(params).then((res) => {
                if (res.code == 200) {
                    this.$message({
                        type: 'success',
                        message: '导出成功',
                    })
                    console.log(res.msg);
                    const url = res.data
                    window.open(url) //通过这个打开网页就可下载导出
                } else {
                    this.$message({
                        type: 'warning',
                        message: res.msg,
                    })
                }
            })
        },
        // 导入数据
        uploadFile() {
            this.dialogVisible = true
        },
        // 关闭导入弹窗
        handleClose() {
            this.dialogVisible = false
        },
        // 上传成功
        handleAvatarSuccess(res, file) {
            if (res.code == 200) {
                this.$message({
                    type: 'success',
                    message: res.msg,
                })
                this.listStorageCycle()
            } else {
                this.$message.error(res.msg)
            }
        },
        // 启用、禁用
        handleStatus(row) {
            openOrCloseSysUser({ id: row.id }).then((res) => {
                if (res.code == 200) {
                    this.$message({
                        type: "success",
                        message: res.msg,
                    });
                    this.getList();
                }
            });
        },
        // 用户类型切换
        typeChange() {
            this.searchForm.companyId = "";
            this.companyArray = [];

            this.searchForm.roleId = "";
            this.baseArray = [];

            // 获取公司列表
            this.getCompanyInfoTree();

            // 查询
            this.onSubmit();
        },
        // 获取公司列表
        getCompanyInfoTree() {
            if (this.searchForm.userType == 0) {
                // 超级管理员，公司只有一个总公司
                getCompanyInfoTree().then((res) => {
                    if (res.code == 200) {
                        this.companyArray = res.data
                    }
                })
            } else {
                getCompanyInfoTree({ id: 0 }).then((res) => {
                    if (res.code == 200) {
                        this.companyArray = res.data
                    }
                })
            }
        },
        // 公司下拉切换
        changeTreeItem(val) {
            if (val) {
                this.searchForm.companyId = val[val.length - 1];
            } else {
                this.searchForm.companyId = "";
            }

            this.searchForm.baseId = "";
            this.baseArray = [];

            this.getList();

            // 获取角色列表
            this.getSysCompanyBases();
        },
        // 获取角色列表
        getSysCompanyBases() {
            if (
                this.searchForm.companyId === "" ||
                this.searchForm.companyId == null
            ) {
                return;
            }

            getSysCompanyBases({ id: this.searchForm.companyId }).then((res) => {
                if (res.code == 200) {
                    this.baseArray = res.data;
                }
            });
        },
    },
};
</script>
<style lang="less" scoped>
.main-breadcrumb {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 76px;
    border-bottom: solid 20px #f2f2f2;
    padding-left: 20px;

    .main-breadcrumb-wrap {
        font-size: 16px;
        line-height: 68px;

        .main-breadcrumb-home {
            cursor: pointer;
            color: #666666;
            font-weight: bold;
        }

        .main-breadcrumb-sp {
            color: #666666;
            font-weight: bold;
        }
    }
}
</style>